<template>
    <van-nav-bar
        title="帮助与客服"
        left-arrow
        @click-left="onClickLeft"
    />
    <div>
        <van-grid :column-num="4" id="box">
            <van-grid-item icon="comment-o" text="意见反馈" icon-color="#2a5caa"/>
            <van-grid-item icon="notes-o" text="笔记申诉" icon-color="#f05b72"/>
            <van-grid-item icon="user-o" text="账号申诉" icon-color="#7fb80e"/>
            <van-grid-item icon="goods-collect-o" text="订单申诉" icon-color="#f58220"/>
            <van-grid-item icon="logistics" text="自助退货" icon-color="#8552a1"/>
            <van-grid-item icon="refund-o" text="7天保价" icon-color="#fdb933"/>
            <van-grid-item icon="pending-payment" text="报销税金" icon-color="orange"/>
        </van-grid>
    </div>
    
    
    <van-tabs v-model:active="active">
        <van-tab title="商城问题">
            <van-cell-group>
                <van-cell>
                    <van-row>
                        <van-col span="5">
                            <van-row><van-icon name="wap-home" color="#ff7987" size="50px"/></van-row>
                            <van-row>物流问题</van-row>
                        </van-col>
                        <van-col span="18">
                            <van-cell>什么时候发货？</van-cell>
                            <van-cell>物流信息不更新？</van-cell>
                        </van-col>
                    </van-row>
                </van-cell>
                <van-cell >
                    <van-row>
                        <van-col span="5">
                            <van-row><van-icon name="comment" color="#2a5caa" size="50px"/></van-row>
                            <van-row>订单问题</van-row>
                        </van-col>
                        <van-col span="18">
                            <van-cell>付款时效规定</van-cell>
                            <van-cell>订单确认收获的时效规定</van-cell>
                        </van-col>
                    </van-row>
                </van-cell>
                <van-cell >
                    <van-row>
                        <van-col span="5">
                            <van-row><van-icon name="wap-home" color="#ff7987" size="50px"/></van-row>
                            <van-row>退换货问题</van-row>
                        </van-col>
                        <van-col span="18">
                            <van-cell>如何申请退换货</van-cell>
                            <van-cell>退款多久到账？</van-cell>
                        </van-col>
                    </van-row>
                </van-cell>
                <van-cell >
                    <van-row>
                        <van-col span="5">
                            <van-row><van-icon name="wap-home" color="#ff7987" size="50px"/></van-row>
                            <van-row>商品问题</van-row>
                        </van-col>
                        <van-col span="18">
                            <van-cell>商品日期怎么看？</van-cell>
                            <van-cell>哪里有商品的使用说明？</van-cell>
                        </van-col>
                    </van-row>
                </van-cell>
                <van-cell >
                    <van-row>
                        <van-col span="5">
                            <van-row><van-icon name="wap-home" color="#ff7987" size="50px"/></van-row>
                            <van-row>支付问题</van-row>
                        </van-col>
                        <van-col span="18">
                            <van-cell>支付方式</van-cell>
                            <van-cell>付款成功后显示待付款</van-cell>
                        </van-col>
                    </van-row>
                </van-cell>
                <van-cell >
                    <van-row>
                        <van-col span="5">
                            <van-row><van-icon name="wap-home" color="#ff7987" size="50px"/></van-row>
                            <van-row>商城规则</van-row>
                        </van-col>
                        <van-col span="18">
                            <van-cell>商城购物规则</van-cell>
                            <van-cell>平台购物争议纠纷处理规则</van-cell>
                        </van-col>
                    </van-row>
                </van-cell>
            </van-cell-group>
        </van-tab>
        <van-tab title="社区问题">
            <van-cell-group>
                <van-cell>
                    <van-row>
                        <van-col span="5">
                            <van-row><van-icon name="wap-home" color="#ff7987" size="50px"/></van-row>
                            <van-row>笔记问题</van-row>
                        </van-col>
                        <van-col span="18">
                            <van-cell>如何发布笔记</van-cell>
                            <van-cell>笔记图片上为什么无法添加话题标签</van-cell>
                        </van-col>
                    </van-row>
                </van-cell>
                <van-cell >
                    <van-row>
                        <van-col span="5">
                            <van-row><van-icon name="wap-home" color="#ff7987" size="50px"/></van-row>
                            <van-row>举报/申诉</van-row>
                        </van-col>
                        <van-col span="18">
                            <van-cell>我的笔记违规了怎么办</van-cell>
                            <van-cell>发现了违规内容，如何举报</van-cell>
                        </van-col>
                    </van-row>
                </van-cell>
                <van-cell >
                    <van-row>
                        <van-col span="5">
                            <van-row><van-icon name="wap-home" color="#ff7987" size="50px"/></van-row>
                            <van-row>账号问题</van-row>
                        </van-col>
                        <van-col span="18">
                            <van-cell>如何注销账号</van-cell>
                            <van-cell>如何修改密码</van-cell>
                        </van-col>
                    </van-row>
                </van-cell>
                <van-cell >
                    <van-row>
                        <van-col span="5">
                            <van-row><van-icon name="wap-home" color="#ff7987" size="50px"/></van-row>
                            <van-row>合作入驻</van-row>
                        </van-col>
                        <van-col span="18">
                            <van-cell>我可以在小蓝书推广自己的商品吗</van-cell>
                            <van-cell>如何进行商务合作/商家入驻</van-cell>
                        </van-col>
                    </van-row>
                </van-cell>
                <van-cell >
                    <van-row>
                        <van-col span="5">
                            <van-row><van-icon name="wap-home" color="#ff7987" size="50px"/></van-row>
                            <van-row>私信/隐私</van-row>
                        </van-col>
                        <van-col span="18">
                            <van-cell>如何发送私信</van-cell>
                            <van-cell>私信收不到</van-cell>
                        </van-col>
                    </van-row>
                </van-cell>
                <van-cell >
                    <van-row>
                        <van-col span="5">
                            <van-row><van-icon name="wap-home" color="#ff7987" size="50px"/></van-row>
                            <van-row>其他问题</van-row>
                        </van-col>
                        <van-col span="18">
                            <van-cell>收藏的笔记去哪里了</van-cell>
                            <van-cell>如何取消收藏</van-cell>
                        </van-col>
                    </van-row>
                </van-cell>
            </van-cell-group>
        </van-tab>
    </van-tabs>
</template>

<script>
export default {
    name: 'Service',
    setup() {
        

        return {
            
        };
    },
    data(){
        return{
            
        }
    },
    methods: {
        onClickLeft(){
            this.$router.go(-1)
        }
    },
}
</script>

<style scoped>
    #box{
        margin-bottom: 12px;
        border-width: 1px 0px;
        border-color: #e7e3e3;
        border-style:solid;
    }
</style>